<template>
  <div>
    <h1>TsCard</h1>
    username : {{ username }}
    <hr>
    age : {{ age }} <button @click="age++">+</button>

    <hr>
    count: {{ count }} <button @click="updateCount(10)">updateCount+</button>
    <button @click="count++">count++</button>

    <hr>
    gender: {{ gender }}

    <TsInfo></TsInfo>

  </div>
</template>
<script setup>
import { inject } from 'vue';

import TsInfo from './TsInfo.vue'

import { injectUsername } from "../key.js";

// 注入
const username = inject(injectUsername);
const age = inject('age');
const gender = inject('gender', 'boy');
const { count, updateCount } = inject('count');
</script>